<!DOCTYPE html>
<!-- paulirish.com/2008/conditional-stylesheets-vs-css-hacks-answer-neither/ -->
<!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7" lang="en"> <![endif]-->
<!--[if IE 7]>    <html class="no-js lt-ie9 lt-ie8" lang="en"> <![endif]-->
<!--[if IE 8]>    <html class="no-js lt-ie9" lang="en"> <![endif]-->
<!-- Consider adding a manifest.appcache: h5bp.com/d/Offline -->
<!--[if gt IE 8]><!-->
<html class="no-js" lang="en">
<!--<![endif]-->
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <title>Mapper</title>
    <link rel="stylesheet" href="css/style.css">
    <link type="text/css" href="css/custom-theme/jquery-ui-1.8.19.custom.css" rel="stylesheet" />
    <link type="text/css" rel="stylesheet" href="jquery.miniColors.css" />
    <link type="text/css" rel="stylesheet" href="css/mapper.css" />
    <link href='http://fonts.googleapis.com/css?family=Nunito:700' rel='stylesheet' type='text/css'>
    <script type="text/javascript" src="js/libs/modernizr-2.5.3.min.js"></script>
</head>
<body>
    <div class="main">
        <div class="toolbar" id="key">
            <div class="titleBar">
                Tiles</div>
        </div>
        <div id="tools" class="toolbar">
            <div class="drawingTools">
                <div class="titleBar">
                    Tools</div>
            </div>
            <div class="annotationTools">
                <div class="titleBar">
                    Annotation</div>
            </div>
            <div class='fileTools'>
                <div class='titleBar'>
                    File</div>
                <div class='buttonContainer' style="height: 26px; width: 26px">
                    <div class='uploadButton toolButton' data-title='Load' style='height: 24px; width: 24px;'>
                        <label class="cabinet">
                            <input class="file" type="file" id="upload" name="file" title="Upload" />
                        </label>
                    </div>
                </div>
                <div class='buttonContainer'>
                    <div class='downloadButton toolButton' data-title='Save' style='width: 24px; height: 24px;
                        text-align: center'>
                        <span id="downloadify">You must have Flash 10 installed to download this file. </span>
                    </div>
                </div>
                <div class='buttonContainer'>
                    <button id="convertToPng" class='toolButton' data-title='Convert to .png' style='width: 26px;
                        height: 26px; text-align: center' name="Convert">
                        <img src="tiles/toImage.png" style="vertical-align: baseline;"></button>
                </div>
            </div>
        </div>
        <div id="canvasDiv">
            <canvas id="grid">
            </canvas>
            <canvas id="drawing">
            </canvas>
            <canvas id="annotation">
            </canvas>
        </div>
        <div class='optionsToggle'>
            <img src="tiles/settings.png"></div>
        <div class='options'>
            <div class="slider">
                <div style="height: 35px;">
                    <label for="amount">
                        Map Opacity:</label>
                    <label id="amount"></label>
                </div>
                <div id="slider">
                </div>
            </div>
        </div>
    </div>
    <div class='status'>
        &nbsp;</div>
    <div class='tooltip'>
    </div>
    <script>
        var _gaq = [['_setAccount', 'UA-1136782-2'], ['_trackPageview']];
        (function (d, t) {
            var g = d.createElement(t), s = d.getElementsByTagName(t)[0];
            g.src = ('https:' == location.protocol ? '//ssl' : '//www') + '.google-analytics.com/ga.js';
            s.parentNode.insertBefore(g, s)
        } (document, 'script'));
    </script>
    <script type="text/javascript" src="js/load.js"></script>
</body>
</html>
